<template>
	<view class="content" style="background: linear-gradient(to bottom,#dceefe,#F4F4F4);">
		<view style="width: 100%; margin-top: 100rpx; align-items: center; justify-content: center;display: block;">
			<image src="@/static/loginnew.jpg" mode="aspectFit" style="width: 100%; height: 250rpx"></image>
			<u--text mode="text" text="高新区机关效能评测系统" bold="bold" size="60rpx" color="#000" align="center"></u--text>
		</view>
		<view
			style="width: 100%;display: block; background-color: unset; justify-content: center; text-align: center; position: absolute; height: 120rpx;top: 200rpx; bottom: 0; margin: auto;" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
			<image src="@/static/weixinnew.png" mode="aspectFit" style="width: 100%; height: 100rpx; " @tap="getPhoneNumber"></image>
			<text style="color: #0256FF; align-content: center; font-size: 32rpx;">微信登录</text>
		</view>
		<view
			style="width: 100%;display: flex; align-items: center;justify-content: center; position: absolute; bottom: 150rpx; height: 40rpx;">
			<image :src="isChecked ? imgSrc : imgUnSelSrc" style="width: 40rpx;height: 40rpx; ;" @tap="changeCheckType"></image>
			<text style="color: #9AA0A3;">我已认真阅读并同意<text
					style="color: #2163E0; font-weight: bold; height: 40rpx;">《隐私协议》</text></text>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isChecked: false,
				imgSrc: "https://mp-eb08f59e-b635-43fb-81b2-8ff3f5ccee36.cdn.bspapp.com/cloudstorage/a24dc57a-baef-47ef-8ede-ab21dbeaa7b7.png",
				imgUnSelSrc: "https://mp-eb08f59e-b635-43fb-81b2-8ff3f5ccee36.cdn.bspapp.com/cloudstorage/4e34553a-d0f3-474a-b96b-3aee6ef0a338.png"}
		},
		methods: {
			changeCheckType() {
				this.isChecked = !this.isChecked;
			},
			
			getPhoneNumber (e) {
				let that = this;
				uni.login({
					provider: 'weixin',
					timeout: 10000,
					onlyAuthorize: false,
					success: function(loginRes) {
						if (!that.isChecked) {
							uni.showToast({
								title:'请先勾选阅读并同意《隐私协议》',
								icon:'none',
								duration:2000
							});
							return;
						} else{
							uni.showToast({
								title:'登录成功',
								icon:'none',
								duration:2000
							});
							setTimeout(()=> {
								uni.switchTab({
									url:'/pages/index/index'
								});
							}, 2000)
						}
					}
				})
			}
		}
	}
</script>

<style>
	page {
		width: 100%;
		height: 100%;
	}

	.content {
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		/* justify-content: center; */
	}
</style>